﻿<div class="layui-form toolbar " id="auth-client-search-div" lay-filter="auth-client-search-div">
    <div class="layui-form-item layui-form-pane">
        <div class="layui-inline">
            <label class="layui-form-label">帐号</label>
            <div class="layui-input-inline">
                <input type="text" name="account" placeholder="请输入帐号" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">用户名</label>
            <div class="layui-input-inline">
                <input type="text" name="nameLike" placeholder="请输入用户名" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">手机号</label>
            <div class="layui-input-inline">
                <input type="text" name="mobile" placeholder="请输入手机号" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">创建时间</label>
            <!--<div class="layui-input-inline">-->
            <!--<input type="text" class="createTime" lay-verify="date" placeholder="yyyy-MM-dd" autocomplete="off" class="layui-input" lay-key="1">-->
            <!--</div>-->
            <div class="layui-input-inline" >
                <input type="text"  name="createTimeGt" autocomplete="off" placeholder="请输入开始时间" class="layui-input createTime">
            </div>
            <div class="layui-form-mid">-</div>
            <div class="layui-input-inline" >
                <input type="text" name="createTimeLt"  autocomplete="off" placeholder="请输入结束时间" class="layui-input createTime">
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">性别</label>
            <div class="layui-input-inline">
                <select name="sex">
                    <option value="">-不限-</option>
                    <option value="1">男</option>
                    <option value="0">女</option>
                </select>
            </div>
        </div>

        <div class="layui-inline ">
            <button id="auth-client-search-btn" class="layui-btn icon-btn"><i class="layui-icon">&#xe615;</i>搜索</button>
        </div>
    </div>
</div>
<table class="layui-table layui-form" id="auth-client-table" lay-filter="auth-client-table"></table>
<!-- 表格toobar -->
<div class="layui-table-tool"  style="display: none" id="auth-client-toolbar">
    <div class="layui-table-tool-temp">
        <button id="auth-client-add-btn" lay-perm='sys-user-add' class="layui-btn layui-btn-primary layui-btn-sm icon-btn"><i
                class="layui-icon">&#xe654;</i>添加
        </button>
        <button id="auth-client-export-btn" class="layui-btn icon-btn layui-btn-primary layui-btn-sm"><i class="layui-icon">&#xe67d;</i>导出
        </button>
    </div>
</div>
<!-- 表格操作列 -->
<div type="text/html" style="display: none" id="auth-client-operate">
    <a class="layui-btn layui-btn-primary layui-btn-xs" lay-perm = 'sys-user-see' lay-event="see">详情</a>
    <a class="layui-btn layui-btn-normal layui-btn-xs" lay-perm = 'sys-user-edit' lay-event="edit">修改</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-perm = 'sys-user-del' lay-event="del">删除</a>
    <a class="layui-btn layui-btn-xs" lay-perm = 'sys-user-edit' lay-event="reset">修改密码</a>
</div>

<script>

    layui.use(['layer', 'form', 'table', 'util', 'admin','laydate'], function () {
        var $ = layui.jquery;
        var layer = layui.layer;
        var form = layui.form;
        var table = layui.table;
        var util = layui.util;
        var admin = layui.admin;
        var laydate = layui.laydate;
        form.render("","auth-client-search-div")
        laydate.render({
            elem: '#auth-client-search-div [name="createTimeGt"]', //指定元素
            type:"datetime",
        });
        laydate.render({
            elem: '#auth-client-search-div [name="createTimeLt"]', //指定元素
            type:"datetime",
        });
        admin.renderTable({
            id:"auth-client-table",
            search:"auth-client-search",
            toolbar: '#auth-client-toolbar',
            defaultToolbar:['filter'],
            url:"auth/client/list",
            cols:[[
                {type: 'checkbox'},
                {field: 'clientId', sort: true, title: 'clientId'},
                {field: 'clientSecret', sort: true, title: '秘钥',hidden:true},
                {field: 'scope', sort: true, title: '权限范围'},
                {field: 'authorizedGrantTypes', sort: true, title: '授权类型'},
                // {field: 'webServerRedirectUri', sort: true, title: '重定向URI'},
                {field: 'authorities', sort: true, title: '客户端权限'},
                {field: 'accessTokenValidity', sort: true, title: 'token过期时间'},
                {field: 'refreshTokenValidity', sort: true, title: 'refreshToken过期时间'},
                // {field: 'additionalInformation', sort: true, title: '额外信息'},
                {align: 'center',toolbar: '#auth-client-operate',width:"20%", title: '操作'}
            ]],
            initSort:{field:"createTime",type:"desc"}
        })

        // 添加按钮点击事件
        $('#auth-client-add-btn').click(function () {
            showEditModel();
        });

        // 工具条点击事件
        table.on('tool(auth-client-table)', function (obj) {
            var data = obj.data;
            var layEvent = obj.event;

            if (layEvent === 'edit') { // 修改
                showEditModel(data);
            } else if (layEvent === 'reset') { // 重置密码
                resetPsw(obj.data.id);
            }else if (layEvent ==="del"){
                del(obj.data.id);
            }else if (layEvent ==="see"){
                showEditModel(data,"see");
            }
        });

        // 导出excel
        $('#btnExp').click(function () {
            var checkRows = table.checkStatus('auth-client-table');
            if (checkRows.data.length == 0) {
                layer.msg('请选择要导出的数据', {icon: 2});
            } else {
                table.exportFile(ins1.config.id, checkRows.data, 'xls');
            }
        });

        // 重置密码
        function resetPsw(userId) {
            admin.openForm({
                title: '修改client密码',
                area: ['500px', '290px'],
                submitId:"auth-client-secret-submit",
                path: 'auth/client/secret.html'
            });
        }

        function del(userId){
            admin.delete("system/user/delete/"+userId,{},function(){
                layer.msg("删除成功", {icon: 1});
                table.reload('auth-client-table')
            })
        }

        // 显示表单弹窗
        function showEditModel(data,see) {
            admin.putTempData('auth-client-form-obj', data);
            admin.putTempData('auth-client-formOk', false);
            admin.openForm({
                see:see,
                title: data ? '修改用户' : '添加用户',
                submitId:"auth-client-submit",
                path: 'system/user/userForm.html',
                end: function () {
                    admin.getTempData('auth-client-formOk') && table.reload('auth-client-table');  // 成功刷新表格
                }
            });
        }

    });
</script>

</body>
</html>